<template>
	<view class="bigBox">
		<view class="title" v-if="dataForm.ruleContent && dataForm.ruleContent!= ''">{{dataForm.ruleContent}}</view>
		<view class="line8" v-if="dataForm.ruleContent&& dataForm.ruleContent!= ''"></view>
		<view class="kiss-upDown-list" v-if="isInspec==0">
			<view class="bx-list-title">
				<view class="left">
					<view style="color: red;" v-if="isInspec == 0">*</view>
					隐患等级
				</view>
			</view>
			<view class="bx-list-title" style="margin-top: 16rpx;">
				<u-radio-group :disabled="isInspec == 1" v-model="dataForm.dangerLevel" placement="row">
					<u-radio :label="'一般隐患'" :name="1" activeColor="#0F53AC"
						:labelColor="dataForm.dangerLevel==1 ? '#0F53AC':''">
					</u-radio>
					<u-radio :customStyle="{marginLeft: '100rpx'}" :label="'重大隐患'" :name="2" activeColor="#0F53AC"
						:labelColor="dataForm.dangerLevel==2 ? '#0F53AC':''">
					</u-radio>
				</u-radio-group>
			</view>
		</view>
		<view class="kiss-list" v-else>
			<view class="kiss-list-title">
				<view class="left">
					隐患等级
				</view>
				<view class="right1">
					<view :class="[dataForm.dangerLevel == 1?'level-small':'level-big']">
						{{ dataForm.dangerLevel == 1?'一般隐患':'重大隐患' }}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-list">
			<view class="kiss-list-title2" :style="{padding: isInspec == 0?'24rpx 32rpx':'32rpx 32rpx 0'}">
				<view class="left">
					<view style="color: red;" v-if="isInspec == 0">*</view>
					隐患位置
				</view>
				<view class="right1" v-if="isInspec == 0" @click="handleUnit()">
					<view class="iconfont icon-app-add sm-sd">请选择</view>
				</view>
			</view>
			<view class="kiss-list-input" v-if="isInspec == 0">
				<u--textarea :autoHeight="true" inputAlign="left" maxlength="32" v-model="dataForm.dangerSite" placeholder="请输入隐患位置">
				</u--textarea>
			</view>
			<view class="textInput " style="padding: 16rpx 32rpx 0;" v-else>{{dataForm.dangerSite || '无'}}
			</view>
		</view>
		<view class="kiss-title" style="margin-top:32rpx;border-top:2rpx solid #f5f5f5;">
			<view class="left">
				隐患照片<view v-if="isInspec == 0" style="color: #8c8c8c;">(可传3张)</view>
			</view>
		</view>
		<view class="kiss-upload" style="padding: 0 32rpx 32rpx 32rpx;">
			<view class="textInput" v-if="isInspec == 1 && fileList1.length == 0">暂无记录照片</view>

			<view class="imgBox" v-else>
				<view class="img" v-for="v in imgList">
					<image @tap="previewImage(v,imgList)" :src="v"></image>
				</view>
				<video class="video" v-for="v in videoList" :src="v"></video>
			</view>

		</view>
		<view class="kiss-upDown-list">
			<view class="bx-list-title">
				<view class="left">
					<view style="color: red;" v-if="isInspec == 0">*</view>
					隐患简述
				</view>
			</view>
			<view class="input-textrea" v-if="isInspec == 0">
				<u--textarea class="textrea" v-model="dataForm.dangerDesc" placeholder="请输入隐患简述" maxlength="1000">
				</u--textarea>
			</view>
			<view class="textInput" v-else>{{dataForm.dangerDesc || '无'}}</view>
		</view>
		<view class="kiss-list">
			<view class="kiss-list-title">
				<view class="left">
					<view style="color: red;" v-if="isInspec == 0">*</view>
					隐患形成原因
				</view>
				<view class="right1">
					<view class="ziti">
						{{ dangerReasonData[dataForm.dangerReason - 1] || '无' }}
					</view>
				</view>
			</view>
		</view>
		<view class="kiss-upDown-list">
			<view class="bx-list-title">
				<view class="left">
					<view style="color: red;" v-if="isInspec == 0">*</view>
					整改意见
				</view>
			</view>
			<view class="input-textrea" v-if="isInspec == 0">
				<u--textarea class="textrea" v-model="dataForm.suggestion" placeholder="请输入整改意见" maxlength="1000">
				</u--textarea>
			</view>
			<view class="textInput" v-else>{{dataForm.suggestion || '无'}}</view>
		</view>

		<template v-if="isTroble != 0">
			<view class="line8"></view>
			<view class="kiss-list">
				<view class="kiss-list-title" @click="togoOpenstartTime">
					<view class="left">
						整改部门
					</view>
					<view class="right1" v-if="isInspec == 0">
						<view :class="[dataForm.rectifyDeptName ? 'select-bg ziti' : '']">
							{{ dataForm.rectifyDeptName ? dataForm.rectifyDeptName : '请选择' }}
						</view>
						<view class="iconfont icon-app-xiangyou"></view>
					</view>
					<view class="right1" v-else>
						<view :class="[dataForm.rectifyDeptName ? 'select-bg ziti' : '']">
							{{ dataForm.rectifyDeptName  ? dataForm.rectifyDeptName : '无' }}
						</view>
					</view>
				</view>
				<view class="kiss-list-title">
					<view class="left">
						整改人
					</view>
					<view class="right1" v-if="isInspec == 0">
						<view :class="[dataForm.rectifyName ? 'select-bg ziti' : '']">
							{{ dataForm.rectifyName ? dataForm.rectifyName : '请选择' }}
						</view>
						<view class="iconfont icon-app-xiangyou"></view>
					</view>
					<view class="right1" v-else>
						<view :class="[dataForm.rectifyName ? 'select-bg ziti' : '']">
							{{ dataForm.rectifyName ? dataForm.rectifyName : '无' }}
						</view>
					</view>
				</view>
				<view class="kiss-list-title">
					<view class="left">
						整改时限
					</view>
					<view class="right1" v-if="isInspec == 0">
						<view :class="[dataForm.limitDate ? 'select-bg ziti' : '']">
							{{ dataForm.limitDate ? dataForm.limitDate : '请选择' }}
						</view>
						<view class="iconfont icon-app-xiangyou"></view>
					</view>
					<view class="right1" v-else>
						<view :class="[dataForm.limitDate ? 'select-bg ziti' : '']">
							{{ dataForm.limitDate ? dataForm.limitDate : '无' }}
						</view>
					</view>
				</view>
				<view class="kiss-upDown-list">
					<view class="bx-list-title">
						<view class="left">
							<view style="color: red;" v-if="isInspec == 0">*</view>
							法律法规
						</view>
					</view>
					<view class="textInput">{{dataForm.rule || '无'}}</view>
				</view>
				<view class="kiss-list">
					<view class="kiss-list-title">
						<view class="left">
							<view style="color: red;" v-if="isInspec == 0">*</view>
							隐患提交时间
						</view>
						<view class="right1" v-if="isInspec == 0">
							<view :class="[dataForm.createTime  ? 'select-bg ziti' : '']">
								{{ dataForm.createTime  ? dataForm.createTime : '请选择' }}
							</view>
							<view class="iconfont icon-app-xiangyou"></view>
						</view>
						<view class="right1" v-else>
							<view :class="[dataForm.createTime  ? 'select-bg ziti' : '']">
								{{ dataForm.createTime  ? dataForm.createTime : '无' }}
							</view>
						</view>
					</view>
				</view>
			</view>


			<template v-if="isTroble==3 || isTroble == 4">
				<u-gap height="6" bgColor="#f2f2f2"></u-gap>
				<view class="kiss-title" :style="'margin-top:32rpx;border-top:2rpx solid #f5f5f5;'">
					<view class="left">
						整改照片<view v-if="isInspec == 0" style="color: #8c8c8c;">(可传3张)</view>
					</view>
				</view>
				<view class="kiss-upload" style="padding: 0 32rpx 32rpx 32rpx;">
					<view class="textInput" v-if="isInspec == 1 && imgList2.length == 0 && videoList2.length == 0">
						暂无记录照片</view>

					<view class="imgBox" v-else>
						<view class="img" v-for="v in imgList2">
							<image @tap="previewImage(v,imgList2)" :src="v"></image>
						</view>
						<video class="video" v-for="v in videoList2" :src="v"></video>
					</view>
				</view>
				<view class="kiss-list">
					<view class="kiss-list-title">
						<view class="left">
							整改人
						</view>
						<view class="right1">
							<view :class="[dataForm.rectifyName ? 'select-bg ziti' : '']">
								{{ dataForm.rectifyName ? dataForm.rectifyName : '无' }}
							</view>
							<view style="color: #0F53AC;margin-left: 10rpx;"
								@click="handleToSeeSign(dataForm.rectifySign)">查看签名</view>
						</view>
					</view>
				</view>
				<view class="kiss-list">
					<view class="kiss-list-title">
						<view class="left">
							<view style="color: red;" v-if="isInspec == 0">*</view>
							整改时间
						</view>
						<view class="right1">
							<view :class="[dataForm.rectifyTime  ? 'select-bg' : '']">
								{{ dataForm.rectifyTime  ? dataForm.rectifyTime : '无' }}
							</view>
						</view>
					</view>
				</view>

				<template v-if="isTroble==3 && reviewFlag== 1">
					<u-gap height="6" bgColor="#f2f2f2"></u-gap>
					<view class="kiss-list">
						<template>
							<view class="kiss-title" :style="'margin-top:32rpx;border-top:2rpx solid #f5f5f5;'">
								<view class="left">
									<view style="color: red;">*</view>
									复查照片<view style="color: #8c8c8c;">(可传3张)</view>
								</view>
							</view>
							<view class="kiss-upload" style="padding: 0 32rpx 32rpx 32rpx;">
								<uploadVideo @getdata="getdata" :fileType="24" :fileMaxNum="3" @delete="deletePicture"
									:file="file">
								</uploadVideo>

							</view>
						</template>
						<view class="kiss-upDown-list">
							<view class="bx-list-title">
								<view class="left">
									<view style="color: red;">*</view>
									复查意见
								</view>
							</view>
							<view class="input-textrea">
								<u--textarea class="textrea" v-model="dataForm.reviewSuggestion" placeholder="请输入复查意见"
									maxlength="1000">
								</u--textarea>
							</view>
						</view>
						<view class="kiss-list">
							<view class="kiss-list-title" style="padding: 22rpx 32rpx;">
								<view class="left">
									<view style="color: red;">*</view>
									复查人
								</view>
								<view class="right1">
									<view v-if="isSign">
										<view class="my-btn2" @click="handleSeeSign" v-if="sign">查看签名</view>
										<view class="my-btn" @click="handleCheckSign" v-else>一键签名</view>
									</view>
									<template v-else>
										<view @click="handleToSetSign">请签字</view>
										<view class="iconfont icon-app-xiangyou"></view>
									</template>

								</view>
							</view>
						</view>
					</view>
				</template>

			</template>
			<!-- 重新整改显示 -->
			<template v-if="(isTroble == 2 || isTroble == 4)">
				<u-gap height="6" bgColor="#f2f2f2"></u-gap>
				<view class="kiss-title">
					<view class="left">

						复查照片
					</view>
				</view>
				<view class="kiss-upload">
					<view class="textInput ziti" v-if="isInspec == 1 && imgList3.length == 0 && videoList3.length == 0">
						暂无记录照片</view>

					<view class="imgBox" v-else>
						<view class="img" v-for="v in imgList3">
							<image @tap="previewImage(v,imgList3)" :src="v"></image>
						</view>
						<video class="video" v-for="v in videoList3" :src="v"></video>
					</view>
				</view>

				<view class="kiss-upDown-list">
					<view class="bx-list-title">
						<view class="left">
							复查意见
						</view>
					</view>
					<view class="textInput ziti">{{dataForm.reviewSuggestion || '无'}}</view>
				</view>

				<view class="kiss-list">
					<view class="kiss-list-title">
						<view class="left">
							复查人
						</view>
						<view class="right1">
							<view :class="[dataForm.reviewName ? 'select-bg ziti' : '']">
								{{ dataForm.reviewName ? dataForm.reviewName : '无' }}
							</view>
							<view style="color: #0F53AC;margin-left: 10rpx;"
								@click="handleToSeeSign(dataForm.reviewSign)">查看签名</view>
						</view>
					</view>
				</view>
				<view class="kiss-list">
					<view class="kiss-list-title">
						<view class="left">
							<view style="color: red;" v-if="isInspec == 0">*</view>
							复查提交时间
						</view>
						<view class="right1">
							<view :class="[dataForm.reviewTime  ? 'select-bg ziti' : '']">
								{{ dataForm.reviewTime  ? dataForm.reviewTime : '无' }}
							</view>
						</view>
					</view>
				</view>
			</template>
		</template>

		<!-- 底部按钮 -->
		<view class="xing-subside" v-if="dataForm.beginRectifyShowFlag == 1"></view>
		<view class="xing-bottom" v-if="dataForm.beginRectifyShowFlag == 1">
			<view class="btn-right" @click="handleToCheck(dataForm.dangerType)">开始整改</view>
		</view>

		<!-- <view class="bottom-box" v-if="dataForm.afreshRectifyShowFlag == 1">
			<view class="btn" @click="handleToCheck">重新整改</view>
		</view> -->
		<view class="xing-subside" v-if="isTroble == 3 && reviewFlag== 1"></view>
		<view class="xing-bottom-double" v-if="isTroble == 3 && reviewFlag== 1">
			<view class="btn-left" @click="handleSumbit(2)">重新整改</view>
			<view class="btn-right" @click="handleSumbit(4)">整改完成</view>
		</view>

		<u-picker :show="showBumen" :columns="bumenColumns" keyName="label" @confirm="onChangeBumen"
			@cancel="cancelBumen"></u-picker>

		<tki-tree ref="tkitree" :range="treeList" rangeKey="configValue" idKey="id" :selectParent="true"
			confirmColor="#0f53ac" @confirm="confirmTree" />

		<u-overlay :show="tipShow" mode="center" round="6">
			<view class="tip_box">
				<view class="title1">
					提示
				</view>
				<view class="top">
					<text>当前未配置区域，请手动输入</text>
				</view>
				<view class="btn">
					<view class="cacel_btn" @click="tipShow = false">
						知道了
					</view>
				</view>
			</view>
		</u-overlay>
	</view>
</template>

<script>
	import uploadVideo from '@/components/uploadVideo/index.vue';
	import tkiTree from "../components/tki-tree/tki-tree.vue"
	export default {
		components: {
			uploadVideo,
			tkiTree
		},
		data() {
			return {
				tipShow: false,
				treeList: [],
				isTroble: 1, // 0.无需整改 1 未整改 2.重新整改 3 已整改 4 整改完成
				isInspec: 1, // 0 编辑 1 查看详情
				showBumen: false,
				bumenColumns: [
					[{
							label: '男',
							id: '1'
						},
						{
							label: '女',
							id: '2'
						}
					]
				],
				onoff: true,
				fileList1: [],
				sourceType: ['album', 'camera'],
				dangerId: '',
				dataForm: {},
				userId: uni.getStorageSync('userInfo').userId,
				imgList: [],
				videoList: [],
				// 整改照片
				imgList2: [],
				videoList2: [],
				// 复查
				saveParams: {
					pictures: '',
				},
				file: '',
				// 是否设置过签名
				isSign: false,
				oldSign: '',
				// 签名设置
				sign: '',
				// 复查照片
				imgList3: [],
				videoList3: [],
				dangerReasonData: ['人的不安全行为', '物的不安全状态', '管理缺陷', '环境与场所', '其他'],
				reviewFlag: ''
			};
		},
		onLoad(options) {
			// 0.无需整改；1.未整改；2.重新整改； 3.已整改；4.整改完成
			this.isTroble = options.dangerStatus
			this.dangerId = options.id
			// 是否可以复查
			this.reviewFlag = options.reviewFlag
			this.initData()
			this.getSign()
			
			// 单元选择回调
			uni.$on('setUnit', (data) => {
				this.dataForm.dangerSite = data.configValue
			})
		},
		onUnload() {
			var pages = getCurrentPages(); //当前页面栈
			if (pages.length > 1) {
				var beforePage = pages[pages.length - 2]; //获取上一个页面实例对象
				beforePage.data.refreshIfNeeded = true;
			}
		},
		onShow() {
			var pages = getCurrentPages(); // 获取当前页面栈
			var currentPage = pages[pages.length - 1]; // 当前页面
			if (currentPage.data.refreshIfNeeded) {
				currentPage.data.refreshIfNeeded = false;
				this.getSign(true)
			}
		},
		methods: {
			confirmTree(e) {
				console.log(e);
				if (e[0]) {
					this.dataForm.dangerSite = e[0].configValue
				}
			},
			//选择隐患位置
			handleUnit() {
				if (this.treeList.length != 0) {
					uni.navigateTo({
						url: `/pages/subPackagesA/riskIdtion/unitTree`
					})
				} else {
					this.tipShow = true
				}
				
			},
			getSign(type = false) {
				uni.$u.http.get(`/base/mobile/userInfo/getLoginUserInfo`).then(res => {
					if (res.code == 0) {
						if (res.data.userSign) {
							this.isSign = true
							this.oldSign = res.data.userSign
							if (type) {
								this.sign = res.data.userSign
							}
						}
					}
				}).catch(err => {})
			},
			initData() {
				uni.$u.http.get(`/check/mobile/appDangerInfo/getDangerDetail/${this.dangerId}`).then(res => {
					if (res.code == 0) {
						this.dataForm = res.data
						this.dataForm.sendSmsFlag = res.data.sendSmsFlag ? true : false
						if (this.reviewFlag == 1) {
							this.dataForm.reviewSuggestion = ''
						}
						this.handleFileList(res.data)
						if (res.data.dangerPhoto != '') {
							// 图片回显
							let arr = []
							res.data.dangerPhoto.split(',').map(item => {
								let dd = {
									url: item
								}
								arr.push(dd);
							})
							this.fileList1 = arr
						} else {
							this.fileList1 = []
						}
					}
				}).catch(err => {})
			},
			handleSumbit(type) {
				let params = {
					id: this.dangerId,
					reviewPhoto: this.saveParams.pictures,
					reviewSuggestion: this.dataForm.reviewSuggestion,
					reviewSign: this.sign,
					dangerStatus: type
				}

				if (type == 2) {
					// 重新整改
					if (params.reviewPhoto == '') {
						uni.$u.toast('请上传相关照片')
						return
					}
					if (params.reviewSuggestion == '') {
						uni.$u.toast('请输入复查意见')
						return
					}
					if (params.reviewSign == '') {
						uni.$u.toast('请先签名')
						return
					}
				} else {
					// 整改完成
					if (params.reviewSign == '') {
						uni.$u.toast('请先签名')
						return
					}
				}
				uni.$u.http.post(`/check/mobile/appDangerInfo/reviewDanger`, params).then(res => {
					if (res.code == 0) {
						uni.$u.toast('提交成功');
						uni.navigateBack({
							delta: 1
						})
					}
				})
			},
			//处理判断是图片还是video
			handleFileList(data) {
				// 隐患照片
				let dangerPhoto = data.dangerPhoto
				if (dangerPhoto) {
					let fileList = dangerPhoto.split(",")

					fileList.forEach(item => {
						let str = item.split('?')[0]
						if (str.substring(str.length - 3, str.length) == 'mp4') {
							this.videoList.push(item)
						} else {
							this.imgList.push(item)
						}
					})
				}
				// 整改照片
				let rectifyPhoto = data.rectifyPhoto
				if (rectifyPhoto) {
					let fileList2 = rectifyPhoto.split(",")
					fileList2.forEach(item => {
						let str = item.split('?')[0]
						if (str.substring(str.length - 3, str.length) == 'mp4') {
							this.videoList2.push(item)
						} else {
							this.imgList2.push(item)
						}
					})
				}
				// 复查照片
				let reviewPhoto = data.reviewPhoto
				if (reviewPhoto) {
					let fileList3 = reviewPhoto.split(",")
					fileList3.forEach(item => {
						let str = item.split('?')[0]
						if (str.substring(str.length - 3, str.length) == 'mp4') {
							this.videoList3.push(item)
						} else {
							this.imgList3.push(item)
						}
					})
				}
			},
			//预览图片
			previewImage: function(e, s) {
				let imgList = []
				if (s.pictures) {
					imgList = this.getpictureList(s.pictures)
				} else {
					imgList = s
				}
				uni.previewImage({
					current: e,
					urls: imgList,
				});
			},
			//处理图片
			getpictureList(pictureinfo) {
				if (pictureinfo) {
					var splitAdd = pictureinfo.split(",");
					var imgList = []
					for (let i = 0; i < splitAdd.length; i++) {
						let iOrV = splitAdd[i].split("?")[0].split(".")
						let iOrVL = splitAdd[i].split("?")[0].split(".").length - 1
						if (iOrV[iOrVL] != 'mp4') {
							imgList.push(splitAdd[i])
						}
					}
					return imgList
				} else {
					return []
				}
			},
			getdata(e) {
				this.pictrueList = e;
				this.fileList1 = [];
				if (this.pictrueList.length > 0) {
					this.saveParams.pictures = "";
					let arry = []
					this.pictrueList.map(item => {
						arry.push(item)
						let dd = {
							url: item
						}
						this.fileList1.push(dd);
					})
					this.saveParams.pictures = arry.toString()
				}
			},
			deletePicture(e) {
				this.fileList1 = [];
				this.saveParams.pictures = "";
				if (e.length > 0) {
					let arry = []
					e.map(item => {
						arry.push(item)
						let dd = {
							url: item
						}
						this.fileList1.push(dd);
					})
					this.saveParams.pictures = arry.toString()
				}
			},
			onChangeBumen(e) {
				this.dataForm.bumen = e.value[0].label
				this.dataForm.bumenId = e.value[0].id
				this.showBumen = false
			},
			cancelBumen() {
				this.showBumen = false
			},
			handleToCheck(type) {
				uni.navigateTo({
					url: `/pages/subPackagesA/troble/checkRectified?dangerStatus=${this.isTroble}&id=${this.dangerId}&type=${type}`
				})
			},
			handleToSeeSign(sign) {

				uni.navigateTo({
					url: `/pages/subPackagesD/mycenter/sginselect?url=
										${encodeURIComponent(JSON.stringify(sign))}&noShow=true`
				})
			},
			handleCheckSign() {
				this.sign = this.oldSign
			},
			handleSeeSign() {
				uni.$u.http.get(
					`/base/upload/bindFileUrl?fileUrl=${this.sign}`
				).then(res => {
					if (res.code == 0) {
						uni.navigateTo({
							url: `/pages/subPackagesD/mycenter/sginselect?url=
											${encodeURIComponent(JSON.stringify(res.data))}&noShow=true`
						})
					}
				}).catch(err => {})
			},
			handleToSetSign() {
				uni.navigateTo({
					url: `/pages/subPackagesD/mycenter/signname?nameType=sign`
				})
			}
		},
	}
</script>

<style scoped lang="scss">
	.bigBox {

		.title {
			padding: 32rpx;
			margin-right: 16rpx;
			word-break: break-all;
			word-wrap: break-word;
		}

		.box {
			padding: 0 20rpx;
		}

		.bx-upload {
			padding: 20rpx 30rpx;
			background: #fff;
			border-bottom: 1px solid #d6d7d9;
		}

		.bottom-subside {
			width: 100%;
			height: 120rpx;
		}

		.bx-bottom {
			width: 100%;
			background: #f2f2f2;
			display: flex;
			justify-content: space-around;
			align-items: center;
			padding: 20rpx 0;
			position: fixed;
			z-index: 9;
			bottom: 0;

			.btn-right {
				width: 80%;
				height: 92rpx;
				border-radius: 12rpx;
				background: #0F53AC;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #fff;
				font-size: 34rpx;
				font-weight: 500;
				letter-spacing: 0px;
				line-height: 0px;
			}
		}

		.lookName {
			color: #0F53AC;
			margin-left: 16rpx;
		}

		.bottom-box {
			width: 100%;
			background: #ffffff;
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 20rpx 32rpx;
			box-sizing: border-box;

			.btn {
				width: 100%;
				height: 92rpx;
				border-radius: 12rpx;
				background: #0F53AC;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #fff;
				font-size: 34rpx;
				font-weight: 500;
				letter-spacing: 0px;
				line-height: 0px;
			}
		}
		.bottom-box-double{
			width: 100%;
			background: #ffffff;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 20rpx 32rpx;
			box-sizing: border-box;
			.btn2 {
			  width: 49%;
			  height: 92rpx;
			  border-radius: 12rpx;
			  background: #ffffff;
			  display: flex;
			  justify-content: center;
			  align-items: center;
			  color: #0f53ac;
			  border: 1px solid #0f53ac;
			  font-size: 34rpx;
			  font-weight: 500;
			  letter-spacing: 0px;
			  line-height: 0px;
			  box-sizing: border-box;
			}
			.btn3 {
			  width: 49%;
			  height: 92rpx;
			  border-radius: 12rpx;
			  background: #0f53ac;
			  display: flex;
			  justify-content: center;
			  align-items: center;
			  color: #fff;
			  font-size: 34rpx;
			  font-weight: 500;
			  letter-spacing: 0px;
			  line-height: 0px;
			}
		}
	}

	.imgBox {
		display: flex;

		.img {
			width: 27vw;
			height: 27vw;
			margin-bottom: 4vw;
			margin-right: 4vw;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.video {
			width: 27vw;
			height: 27vw;
			margin-bottom: 4vw;
			margin-right: 4vw;
		}
	}

	.my-btn {
		padding: 14rpx 24rpx;
		background: rgba(255, 255, 255, 1);
		border: 1px solid rgba(15, 83, 172, 1);
		color: rgba(15, 83, 172, 1);
		font-size: 28rpx;
		border-radius: 8rpx;
	}

	.my-btn2 {
		padding: 14rpx 24rpx;
		background: rgba(15, 83, 172, 1);
		border: 1px solid rgba(15, 83, 172, 1);
		color: rgba(255, 255, 255, 1);
		font-size: 28rpx;
		border-radius: 8rpx;
	}
	
	.tip_box {
		width: 560rpx;
		padding-top: 64rpx;
		background-color: #fff;
		border-radius: 12rpx;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
	
		.title1 {
			text-align: center;
			margin-bottom: 32rpx;
			font-size: 32rpx;
			font-weight: 500;
		}
	
		.top {
			font-size: 16px;
			font-weight: 400;
			padding-bottom: 64rpx;
			color: #4D4D4D;
			text-align: center;
			border-bottom: 2rpx solid #e5e5e5;
		}
	
		.btn {
			display: flex;
			justify-content: center;
			align-items: center;
	
			.cacel_btn {
				text-align: center;
				font-size: 34rpx;
				font-weight: 500;
				color: #0F53AC;
				width: 50%;
				height: 112rpx;
				line-height: 112rpx;
			}
	
		}
	}
	
	.ziti {
		font-size: 16px;
		color: #2b2b2b;
		font-weight: 400;
	}
</style>